<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>玩转石板河</title>
		<link href="/css/styleShibanhe.css" type="text/css" rel="stylesheet" />
	</head>
	<body>
		<style>
			.content{min-width: 1300px;overflow-x:auto;}
			.banner{width: 100%;height: 484px;background: url(/img/banner2.png) no-repeat center center;background-size: 1920px 100%;position: relative;}
			.bannerArea{width: 1190px;position: absolute;left: 50%;transform: translateX(-50%);bottom: 60px;text-align: right;z-index: 2;}
			.bannerArea p{font-size: 35px;color: #fff;line-height: 1.4;font-weight: 200;text-transform:uppercase;}
			.nav{width: 100%;height: 48px;background: url(/img/nav.png) no-repeat center center;background-size: 1920px 48px;}
			.nav p{width: 1260px;margin: 0 auto;display: flex;align-items: center;height: 48px;color: #000000;}
			.nav p img{margin-right: 10px;}
			
			.main{width: 100%;background: url(/img/back3.png) no-repeat;background-size: 1920px 1434px;background-position: center bottom;padding-top: 1px;}
			.title{height: 81px;display: block;margin: 65px auto 20px;}
			.tabBox{height: 35px;width: 1260px;margin:0 auto 55px;}
			.tabUl{display: flex;justify-content: space-around;}
			.tabUl li{width: 186px;height: 35px;line-height: 35px;color: #50ac53;text-align: center;background: url(/img/active2.png) no-repeat;cursor: pointer;font-size: 16px;}
			.tabUl li.active,.tabUl li:hover{background: url(/img/active1.png) no-repeat;color: #fff;}
			
			.scenicPart{padding-bottom: 40px;}
			.scenic{width: 1220px;height: 244px;background: #fff;margin: 0 auto 20px;display: flex;}
			.scenicImg{width: 325px;height: 244px;}
			.scenicBox{padding: 40px 35px 0;position: relative;}
			.scenicName{height: 18px;align-items: center;justify-content: space-between;margin-bottom: 20px;}
			.scenicName p{color: #000000;font-weight: 600;font-size: 18px;line-height: 18px;width: 70%;overflow: hidden;text-overflow:ellipsis; white-space: nowrap;}
			.scenicName span{font-size: 14px;position: relative;right: -650px;top:-19px}
			.scenicP{font-size: 14px;color: #000000;line-height: 1.5;display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
			.scenicMore{position: absolute;bottom: 36px;left: 35px;}
			.language{position: absolute;top:30px;right: 30px;font-size: 12px;z-index: 222}
			.language span{margin: 0 3px;color: #ccc;}
			.language .cur{color: #fff;}
			.nav a{color: black}
		</style>
		<div class="content">
			<div class="banner">
				<div class="language">
					<span class="cur">中文</span>
					<span>English</span>
					<span>日本語</span>
					<span>한국어</span>
				</div>
				<div class="head">
					<div class="headLeft cur">
						<a href="/">网站首页</a>
					</div>
					<div class="headLeft">
						<a href="/walking">走进景区</a>
					</div>
					<div class="headLeft">
						<a href="/impression">印象景区</a>
					</div>
					<div class="headLeft">
						<a href="/play">玩转景区</a>
					</div>
					<img class="logo" src="/img/logo.jpg" style="width:180px;height:172px"/>
					<div class="headRight">
						<a href="/shopping">景区周边</a>
					</div>
					<div class="headRight">
						<a href="/dynamic">景区动态</a>
					</div>
					<div class="headRight">
						<a href="/strategy">旅游攻略</a>
					</div>
					<div class="headRight">
						<a href="/service">客户服务</a>
					</div>
				</div>
				<div class="bannerArea">
					<p>> 玩转石板河</p>
					<p>Playing around SHI BAN HE</p>
				</div>
			</div>
		
			<div class="nav">
				<p><img src="/img/location.png"/>您的位置：<a href="/">网站首页&nbsp;></a>&nbsp;<a href="/play">玩转石板河&nbsp;></a>&nbsp;<a href="#" class="siteChange">娱</a></p>
			</div>
		
			<div class="main">
				<img class="title" src="/img/title3.png" />
				<div class="tabBox">
					<ul class="tabUl">
						<li class="active">吃</li>
						<li>住</li>
						<li>行</li>
						<li>游</li>
						<li>购</li>
						<li>娱</li>
					</ul>
				</div>
				
				<div class="scenicPart">
					<!--<div class="scenic">
						<img class="scenicImg" src="/img/img15.png" style="width:325px"/>
						<div class="scenicBox">
							<div class="scenicName"><p>娱乐景点</p><span>2019-7-11</span></div>
							<p class="scenicP">石板河景区位于宝丰县石板河村建于南石河北岸，故名“石板河村”。四周群山环抱，绿树成荫，鸟语花香，森林覆盖率在80%以上，传统建筑集中，连片分布。村内矿产丰富，地貌奇特，林木繁茂，风景优美，景区规划面积6.3平方公里，总投资约35000万元，景区内有公共建筑及旅游设施、特色民宿、原始森林、游乐设施、林果采摘、拓展训练基地、美食街等体验内容。</p>
							<a class="scenicMore"><img src="/img/more.png" /></a>
						</div>
					</div>-->
				</div>
				
				<div class="box">
					<div id="pagination" class="page fl"></div>
				</div>

				<div class="footer">
					<div class="footerTop">
						<span>友情链接：</span>
						<img src="/img/icon2.png" />
						<img src="/img/icon3.png" />
						<img src="/img/icon4.png" />
						<img src="/img/icon5.png" />
						<img src="/img/icon6.png" />
						<img src="/img/icon7.png" />
						<img src="/img/icon8.png" />
						<img src="/img/icon9.png" />
					</div>
					<ul class="footUl">
						<li><a href="/">网站首页</a></li>
						<li><a href="/walking">走进石板河</a></li>
						<li><a href="/impression">印象石板河</a></li>
						<li><a href="/play">玩转石板河</a></li>
						<li><a href="/surrounding">景区导览</a></li>
						<li><a href="/dynamic">景区动态</a></li>
						<li><a href="/strategy">旅游攻略</a></li>
						<li><a href="/service.html">客户服务</a></li>
					</ul>
					<p><span id="companyName">安徽省石板河旅游发展有限公司</span>　版权所有　 <span id="copyright">Copyright © 2020 All Right Reserve　</span></p>
					<p>免责申明　皖公网安备 <span id="recordNo">34018102340321号</span></p>
					<p>技术支持：<span id="technicalSupport">徽章纵视</span></p>
				</div>
			</div>
		</div>
		<script src="/js/jquery.min.js"></script>
		<script src="/js/jquery.pagination.js"></script>
		<script>
			function GetRequest() {
				var url = location.search; //获取url中"?"符后的字串
				var theRequest = new Object();
				if (url.indexOf("?") != -1) {
					var str = url.substr(1);
					strs = str.split("&");
					for(var i = 0; i < strs.length; i ++) {
						theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
					}
				}
				return theRequest;
			}


			$(document).ready(function(){
				var a=GetRequest();
				/*var index1 = a['index'];
				var index =1*/

				$(".tabUl li").click(function(){
					$(".tabUl li").removeClass('active');
					$(this).addClass('active');

					var index = $(this).index()+1;
					var arr = ['吃','住','行','游','购','娱'];
					$(".siteChange").html(arr[index-1]);

					var pageCount=1;
					var totalData=1;
					Init(0)

					function Init(pageIndex){
						$.ajax({
							type : "POST",
							url :  "/scenery/article/sceneryArticleList",
							data : {articleType:10,palyType:index,articleTitle:'',offset:pageIndex,limit:3},
							async : false,
							success : function(data) {
								if(data != null && data != '') {
									$("#pagination").append("<span>共"+data.total+"条信息</span>")
									totalData=data.total
									if(parseInt(data.total)>=3){
										pageCount=Math.ceil(data.total/3);
									}else{
										pageCount=1;
									}
									var leijia="";
									for (var i=0;i<data.rows.length;i++){
										var div = "<div class=\"scenic\">";
										$.ajax({
											type : "POST",
											url :  "/common/sysFile/list",
											data : {attachId:data.rows[i].attachId},
											async : false,
											success : function(data) {
												if(data != null && data != '') {
													div+="<img class='scenicImg' src='"+data[0].fileUrl+"' style='width:325px'/>"
												}
											}
										});
										div+="<div class='scenicBox'>" +
												"<div class='scenicName'><p>"+data.rows[i].articleTitle+"</p><span>"+data.rows[i].createTime+"</span></div>" +
												"<p class='scenicP'>"+data.rows[i].articleIntroduction+"</p>" +
												"<a class='scenicMore' href=\"/detailPrice?id="+data.rows[0].id+"\"><img  src='/img/more.png' /></a>" +
												"</div></div>"
										leijia+=div
									}
									$('.scenicPart').html(leijia);
								}
							}
						});
					}


					function pageselectCallback(page_id, jq) {
						Init((page_id.getCurrent()-1)*3)
					}
					$("#pagination").pagination( {
						callback: pageselectCallback,//PageCallback() 为翻页调用次函数。
						pageCount: pageCount, //总页数
						totalData: totalData,
						items_per_page: 3, //每页的数据个数
						coping: true,
						homePage: '首页',
						endPage: '末页',
						prev_text: " 上一页",
						next_text: "下一页 ",
					});
				})
				$(".tabUl li").eq(0).click();



				$.ajax({
					type : "GET",
					url :  "/sys/sysSet/getSet",
					data : {type:''},
					async : false,
					success : function(data) {
						if(data != null && data != '') {
							if(data.code==0){
								var setDOList=data.setDOList
								for (var i=0;i<setDOList.length;i++){
									$("#"+setDOList[i].setCode).text(setDOList[i].setValue)
								}
							}
						}
					}
				});
			})



			
		</script>
	</body>
</html>

